<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head th:replace="_fragments :: header(~{::title})">
    <link rel="stylesheet" type="text/css" href="../static/semantic.min.css" th:href="@{/semantic.min.css}">
    <script
            src="https://code.jquery.com/jquery-3.1.1.min.js"
            integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8="
            crossorigin="anonymous"></script>
    <script src="../static/semantic.min.js" th:href="@{/semantic.min.js}"></script>
    <meta charset="UTF-8">
    <title>归档</title>
</head>
<body>

<div class="ui borderless main menu " th:replace="_fragments::menu(3,blue)">
    <div class="ui huge text container">
        <a class="item" href="index.html" th:href="index">
            <i class="home icon"></i> 主页
        </a>
        <a class="item" href="category.html" th:href="category">
            <i class="folder icon"></i> 分类
        </a>
        <a class="item active blue" th:href="archive">
            <i class="archive icon"></i> 归档
        </a>
        <a class="item" href="tags.html" th:href="tags">
            <i class="tags icon"></i> 标签
        </a>
        <div class="ui simple green dropdown item">
            更多
            <i class="dropdown icon"></i>
            <div class="menu">
                <a class="item"><i class="chess king icon"></i> 关于作者</a>
                <a class="item"><i class="language icon"></i> 选择语言</a>
                <a class="item"><i class="settings icon"></i> 账号设置</a>
            </div>
        </div>
        <div class="right item">
            <div class="ui icon input">
                <input type="text" placeholder="搜索...">
                <i class="search icon"></i>
            </div>
        </div>
    </div>
</div>
<div class="ui borderless grid">
    <div class="ui two wide column"></div>
    <div class="ui eleven wide column">
        <div class="ui container">
            <br>
            <div>
                <H1>历史归档</H1>
            </div>

            <br>
            <div class="ui middle aligned animated list" th:each="article:${pageInfo.getList()}">
                <div class="item">
                    <div class="content">
                        <div class="header"><i class="linkify icon"></i><a href="#" th:href="@{'/blog/'+${article.id}}"
                                                                           th:text="${article.getTitle()}">Java开发</a><span
                                class="ui label small"
                                th:text="${#dates.format(article.getCreate_time(),'yyyy-MM-dd hh:mm:ss')}">2021年04月15日 14:23</span>
                        </div>
                    </div>
                </div>
            </div>
            <div class="ui mini pagination menu right floated">
                <a class="item" id="pre" th:href="@{/archive(page=${pageInfo.getPrePage()})}"
                   th:unless="${pageInfo.isIsFirstPage()}">上一页</a>
                <a class="item" id="next" th:href="@{/archive(page=${pageInfo.getNextPage()})}"
                   th:unless="${pageInfo.isIsLastPage()}">下一页</a>
            </div>



        </div>
    </div>
    <div class="ui three wide column"></div>
</div>
</body>
</html>